import React from "react";
import { Tabs, Space, Button } from "antd";
import Tabs1 from '../../../component/Tabs1'

const { TabPane } = Tabs;

const Examine = () => {
    const columns = [
        {
            title: "序号",
            dataIndex: "num",
            key: "num",
            align: 'center',
        },
        {
            title: "小区名称",
            dataIndex: "name",
            key: "name",
            align: 'center',
        },
        {
            title: "标题",
            dataIndex: "title",
            key: "title",
            align: 'center',
        },
        {
            title: "面积",
            dataIndex: "measure",
            key: "measure",
            align: 'center',
            render: (text) => <span>{text}㎡</span>
        },
        {
            title: "总价",
            key: "allPrice",
            dataIndex: "allPrice",
            align: 'center',
            render: (text) => <span>{text}万</span>
        },
        {
            title: "排序",
            dataIndex: "sort",
            key: "sort",
            align: 'center',
        },
        {
            title: "状态",
            dataIndex: "state",
            key: "state",
            align: 'center',
            render: (text) => <span>{text ? '审核完成' : '待审核'}</span>
        },
        {
            title: "操作",
            key: "action",
            align: 'center',
            render: (text, record) => (
                <Space size="middle">
                    <Button type='text'>审核</Button>
                    <Button type='text'>编辑</Button>
                    <Button type='text'>删除</Button>
                </Space>
            ),
        },
    ],
        data = [
            {
                num: "1",
                name: "珑城半山公馆",
                title: '滨海国际小区',
                measure: '111',
                allPrice: '21',
                sort: '50',
                state: 0,
                key: '1'
            },
            {
                num: "2",
                name: "珑城半山公馆",
                title: '滨海国际小区',
                measure: '111',
                allPrice: '21',
                sort: '50',
                state: 1,
                key: '2'
            },
            {
                num: "3",
                name: "珑城半山公馆",
                title: '滨海国际小区',
                measure: '111',
                allPrice: '21',
                sort: '50',
                state: 1,
                key: '3'
            },
        ],
        columns1 = [
            {
                title: "序号",
                dataIndex: "num",
                key: "num",
                align: 'center',
            },
            {
                title: "小区名称",
                dataIndex: "name",
                key: "name",
                align: 'center',
            },
            {
                title: "标题",
                dataIndex: "title",
                key: "title",
                align: 'center',
            },
            {
                title: "面积",
                dataIndex: "measure",
                key: "measure",
                align: 'center',
                render: (text) => <span>{text}㎡</span>
            },
            {
                title: "总价",
                key: "allPrice",
                dataIndex: "allPrice",
                align: 'center',
                render: (text) => <span>{text}万</span>
            },
            {
                title: "排序",
                dataIndex: "sort",
                key: "sort",
                align: 'center',
            },
            {
                title: "状态",
                dataIndex: "state",
                key: "state",
                align: 'center',
                render: (text) => <span>{text ? '审核完成' : '待审核'}</span>
            },
            {
                title: "操作",
                key: "action",
                align: 'center',
                render: (text, record) => (
                    <Space size="middle">
                        <Button type='text'>审核</Button>
                        <Button type='text'>编辑</Button>
                        <Button type='text'>删除</Button>
                    </Space>
                ),
            },
        ],
        data1 = [
            {
                num: "1",
                name: "珑城半山公馆",
                title: '滨海国际小区',
                measure: '111',
                allPrice: '21',
                sort: '50',
                state: 1,
                key: '1'
            },
            {
                num: "2",
                name: "珑城半山公馆",
                title: '滨海国际小区',
                measure: '111',
                allPrice: '21',
                sort: '50',
                state: 1,
                key: '2'
            },
            {
                num: "3",
                name: "珑城半山公馆",
                title: '滨海国际小区',
                measure: '111',
                allPrice: '21',
                sort: '50',
                state: 1,
                key: '3'
            },
        ],
        columns2 = [
            {
                title: "序号",
                dataIndex: "num",
                key: "num",
                align: 'center',
            },
            {
                title: "小区名称",
                dataIndex: "name",
                key: "name",
                align: 'center',
            },
            {
                title: "标题",
                dataIndex: "title",
                key: "title",
                align: 'center',
            },
            {
                title: "面积",
                dataIndex: "measure",
                key: "measure",
                align: 'center',
                render: (text) => <span>{text}㎡</span>
            },
            {
                title: "总价",
                key: "allPrice",
                dataIndex: "allPrice",
                align: 'center',
                render: (text) => <span>{text}万</span>
            },
            {
                title: "排序",
                dataIndex: "sort",
                key: "sort",
                align: 'center',
            },
            {
                title: "状态",
                dataIndex: "state",
                key: "state",
                align: 'center',
                render: (text) => <span>{text ? '审核完成' : '待审核'}</span>
            },
            {
                title: "操作",
                key: "action",
                align: 'center',
                render: (text, record) => (
                    <Space size="middle">
                        <Button type='text'>审核</Button>
                        <Button type='text'>编辑</Button>
                        <Button type='text'>删除</Button>
                    </Space>
                ),
            },
        ],
        data2 = [
            {
                num: "1",
                name: "珑城半山公馆",
                title: '滨海国际小区',
                measure: '111',
                allPrice: '21',
                sort: '50',
                state: 0,
                key: '1'
            },
            {
                num: "2",
                name: "珑城半山公馆",
                title: '滨海国际小区',
                measure: '111',
                allPrice: '21',
                sort: '50',
                state: 0,
                key: '2'
            },
            {
                num: "3",
                name: "珑城半山公馆",
                title: '滨海国际小区',
                measure: '111',
                allPrice: '21',
                sort: '50',
                state: 0,
                key: '3'
            },
        ];
    // tabs切换
    const changeTab = (key) => {
        console.log(key);
    };
    return (
        <div className="examine">
            <p className="header_title">审核管理</p>
            <Tabs onChange={changeTab} type="card">
                <TabPane tab="全部" key="1">
                    <Tabs1 columns={columns} data={data} />
                </TabPane>
                <TabPane tab="审核通过" key="2">
                    <Tabs1 columns={columns1} data={data1} />
                </TabPane>
                <TabPane tab="审核不通过" key="3">
                    <Tabs1 columns={columns2} data={data2} />
                </TabPane>
            </Tabs>
            <div className="examine_main"></div>
        </div>
    );
};

export default Examine;
